<template>
  <div>
    <div class="grid grid-cols-2 md:gap-4 !md:m-4">
      <TenantAppSubCard v-if="checkPowerByName('appAnalysisByTenant')" />
      <AppRenewalAndUnsubRateCard v-if="checkPowerByName('appProportion')" />
      <TotalAppSubCard v-if="checkPowerByName('getAppStatistic')" />
      <TotalAppSubRateCard v-if="checkPowerByName('getAppRenewOrUnsubRate')" />
      <!-- <TenantAppSubCard />
      <AppRenewalAndUnsubRateCard />
      <TotalAppSubCard />
      <TotalAppSubRateCard /> -->
    </div>
  </div>
</template>

<script lang="ts" setup>
import TenantAppSubCard from './cards/TenantAppSubCard.vue';
import AppRenewalAndUnsubRateCard from './cards/AppRenewalAndUnsubRateCard.vue';
import TotalAppSubCard from './cards/TotalAppSubCard.vue';
import TotalAppSubRateCard from './cards/TotalAppSubRateCard.vue';
import { checkPowerByName } from '../../../../utils/permission';
</script>
